<script>
import {defineComponent} from 'vue'
import router from "@/router";
import {onBeforeRouteLeave} from "vue-router";

export default defineComponent({
  setup(){
    onBeforeRouteLeave(()=>{
      const link = document.querySelector('link[href="src/assets/NavigationPage/index.css"]')
      if (link){
        link.parentNode.removeChild(link)
        console.log("删除成功")
      }
    })
  },
  name: "lead-page",
  methods : {
    to_main_page(){
      router.push('/index')
    },
  }
})
</script>

<template>
    <div class="site-container">
        <div class="site-container-moon"></div>
        <header class="site-header">
            <div class="wrap">
                <div class="site-header-inner">
                    <div class="site-header-left">
                        <a href="#">Hello Store</a>
                    </div>
                    <div class="site-header-right">
                        <nav class="site-navigation">
                            <ul class="level">
                                <li>
                                    <router-link to="/login">sign in</router-link>
                                </li>
                                <li>
                                    <a href="#">About</a>
                                </li>
                                <li>
                                    <router-link to="/register">register</router-link>
                                </li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>
        </header>
        <main class="site-main">
            <div class="page-header home">
                <div class="wrap clearfix">
                    <div class="page-header inner">
                        <h1 class="page-title">Say Hello To Our Store!</h1>
                        <div class="page-header-text">
                            Lead you to new ways of pet shopping
                        </div>
                        <div class="page-header-thing">
                            <div class="top-label">
                                <input type="button" value="Enter Our Store" @click="to_main_page">
                            </div>
                        </div>
                        <span class="scroll-btn icon-arrow" @click="">
                        click for more
                    </span>
                    </div>
                    <div class="page-header-moon">
                        <span></span>
                    </div>
                </div>
            </div>
        </main>
    </div>
</template>

<style scoped>

</style>